<template>
  <common-edit-dialog
    :title="dialogTitle"
    :visible.sync="dialogShow"
    :button-loading="buttonLoading"
    @cancel="close"
    @submit="submitForm"
  >
    <el-form ref="form" :model="form" label-width="100px" :inline="true">
      <el-form-item prop="falseAlarmType">
        <el-checkbox-group v-model="form.falseAlarmType">
          <el-checkbox label="0" v-if="ip">源IP（{{ ip }}）</el-checkbox>
          <el-checkbox label="1"
            >规则名称<span v-if="ruleName"
              >（{{ ruleName }}）</span
            ></el-checkbox
          >
        </el-checkbox-group>
      </el-form-item>

      <div
        class="toast"
        v-if="
          form.falseAlarmType.length === 1 && form.falseAlarmType[0] === '0'
        "
      >
        注：源IP等于该值的将不再产生告警
      </div>
      <div
        class="toast"
        v-if="
          form.falseAlarmType.length === 1 && form.falseAlarmType[0] === '1'
        "
      >
        注：规则名称等于该值的将不再产生告警
      </div>
      <div class="toast" v-if="form.falseAlarmType.length === 2">
        注：规则名称+源IP等于该值的将不再产生告警
      </div>
    </el-form>
  </common-edit-dialog>
</template>

<script>
import { missRecordAdd, missRecordEdit } from "@/api/alarmCenter/index";

export default {
  components: {},
  props: {
    isMissRecord: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      dialogTitle: "新增", // 标题
      dialogShow: false, // 是否显示
      form: {
        falseAlarmType: ["1"],
      },
      buttonLoading: false,
      ip: "",
      ruleName: "",
    };
  },
  methods: {
    close() {
      this.$refs.form.resetFields();
      this.dialogShow = false;
    },
    /**
     * 显示
     */
    show(data) {
      if (this.isMissRecord) {
        this.form.id = data.id;
      } else {
        this.form.alarmInfoId = data.id;
      }
      this.dialogTitle = this.isMissRecord ? "编辑误报记录" : "告警处置—误报";
      this.form.falseAlarmType = this.isMissRecord ? [] : ["1"];
      console.log(this.form.falseAlarmType);
      this.dialogShow = true;
      this.ip = data.sourceIp;
      this.ruleName = data.ruleName;
      this.getCurrentFalseType(data);
    },

    getCurrentFalseType(data) {
      let value = [];
      if (data.falseAlarmType === null) {
        value = this.isMissRecord ? [] : ["1"];
      } else if (data.falseAlarmType === 0) {
        value = ["0"];
      } else if (data.falseAlarmType === 1) {
        value = ["1"];
      } else if (data.falseAlarmType === 2) {
        value = ["0", "1"];
      }
      this.$set(this.form, "falseAlarmType", value);
    },
    /**
     * 提交
     */
    submitForm() {
      const data = { ...this.form };
      if (!data.falseAlarmType || data.falseAlarmType.length === 0) {
        this.$GlobalErrorConfirm("警告", "请选择误报处理类型");
        return;
      }

      if (data.falseAlarmType && data.falseAlarmType.length === 2) {
        data.falseAlarmType = ["2"];
      }

      data.falseAlarmType = data.falseAlarmType.join("");

      this.buttonLoading = true;

      if (this.isMissRecord) {
        missRecordEdit(data)
          .then((res) => {
            if (res && res.code === 200) {
              this.$GlobalSuccessMessage("编辑成功");
              this.dialogShow = false;
              this.$emit("refresh");
            } else {
              this.$GlobalErrorConfirm("编辑失败", res.msg);
            }
          })
          .finally(() => {
            this.buttonLoading = false;
          });
      } else {
        missRecordAdd(data)
          .then((res) => {
            if (res && res.code === 200) {
              this.$GlobalSuccessMessage("处理成功");
              this.dialogShow = false;
              this.$emit("refresh");
            } else {
              this.$GlobalErrorConfirm("处理失败", res.msg);
            }
          })
          .finally(() => {
            this.buttonLoading = false;
          });
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.toast {
  color: #f56c6c;
  font-size: 12px;
}
</style>
